/* Global */
* {margin: 0; padding: 0; box-sizing: border-box;}
.text-left {text-align: left;}
.text-center {text-align: center;}
.text-right {text-align: right;}
.text-success {color: #0a9b2e;}
.text-danger {color: #dc3545;}
.text-ellipsis {overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
.row-flex {display: flex;}
.row-flex[align="center"] {align-items: center;}
.row-flex-prefix {margin-right: .5em;}
.row-flex-main {width: 0;flex-grow: 1;text-align: left;}
.row-flex-main + .row-flex-main {margin-left: .5em;}
.row-flex-suffix {margin-left: .5em;}
[v-cloak]{display: none;}
html {font-size: 14px;color: #333;background: #fff;overflow: hidden auto;}
.toast {
  padding: 1rem 2rem;border-radius: 4px;background: rgba(0, 0, 0, 0.8);color: #fff;
  position: fixed;top: 50px;left: 50%;transform: translateX(-50%);
}
.modal-wrapper {position: fixed;top: 0;left: 0;right: 0;bottom: 0;background: rgba(0, 0, 0, 0.5)}
.modal {
  position: absolute;left: 50%;top: 50%;z-index:9;transform: translate(-50%, -50%);
  width: 85vw;max-height:90vh;padding: 15px;border-radius: 4px;background: #fff;overflow: hidden auto;
}
.modal-head {font-size: 1.6rem;font-weight: 600;}
.modal-body {margin: 30px 0;font-size: 1.2rem;}
.modal-button {display: inline-block;padding: 8px 3em;border-radius: 4px;background: #169bd5;color: #fff;cursor: pointer;}
/* Goods */
.goods {margin: 15px;}
.goods-photo {width: 150px;height: 200px;}
.goods-photo img {display: block;width: 100%;height: 100%;object-fit: contain;background: #f5f5f5;}
.goods-info {line-height: 2;}
.goods-title {font-size: 1.4rem;font-weight: 600;}
.goods-status {
  display: inline-block;padding: 8px 10px;border: 1px solid #eee;border-radius: 4px;
  margin-top: 10px;color: #666;line-height: 1;
}
/* Pay */
.pay-warning {margin: 15px 0;}
.pay-warning-label {
  display: inline-block;max-width: 100%;padding-left: 1em;padding-right: 2.5em;
  color: #fff;line-height: 2.5;overflow: hidden;position: relative;
}
.pay-warning-bg {
  position: absolute;top: 50%;left: 0;z-index: -1;transform: translateY(-50%);width: 100%;height: 0;
  border: 2rem solid #fd4a3a;border-right-color: transparent;border-right-width: 1.5rem;
}
.pay-selector {margin: 15px;display: flex;justify-content: space-between;flex-wrap: wrap;}
.pay-option {padding: 8px;border: 1px solid #ccc;border-radius: 4px;margin: 6px 0;cursor: pointer;}
.pay-option.active {border-color: #007bff;background: #e8f1fe;}
.pay-button {
  margin: 15px;padding: 8px;border-radius: 4px;
  background: #169bd5;color: #fff;cursor: pointer;
}
.panel-paid {margin: 25px 15px;}
.panel-paid .fa-unlock {font-size: 5rem;}
.panel-paid p {font-size: 1.2rem;line-height: 2.5;}
